<!DOCTYPE html>
<html>
<head>
    <title>Processflow List</title>
    <style>
        table {
            width: 100%;
            border-collapse: collapse;
        }

        th, td {
            border: 1px solid #ddd;
            padding: 8px;
            text-align: left;
        }

        th {
            background-color: #f2f2f2;
        }
    </style>
    <script>
        // JavaScript函数来处理点击事件
        function acceptTask(taskId) {
            fetch('/your-accept-endpoint', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify({ taskId: taskId })
            })
                .then(response => response.json())
                .then(data => {
                    console.log('Success:', data);
                    // 可以在这里添加一些UI更新逻辑，比如更新表格行状态
                })
                .catch((error) => {
                    console.error('Error:', error);
                    // 处理错误，比如显示错误消息
                });
        }
    </script>
</head>
<body>
<h2>Processflow List</h2>

<#--<p>Login Info: ${login.someProperty} <!-- 替换someProperty为LoginDTO中的实际属性 &ndash;&gt;-->

<table>
    <tr>
        <th>操作</th>
        <th>ID</th>
        <th>所属工艺路线编号</th>
        <th>工单编码</th>
        <th>产品编号</th>
        <th>当前工序</th>
        <th>下一道工序</th>
        <th>执行人</th>
        <th>下一道工序的执行人</th>
        <th>当前状态</th>
        <!-- 可以根据需要添加更多列 -->
    </tr>
    <!-- 遍历processflow列表 -->
    <#list processflow as item>
        <tr>
            <td>
                <button class="accept" onclick="acceptTask('${item.id}')">接受该任务</button>
            </td>
            <td>${item.id}</td>
            <td>${item.routeNumber}</td>
            <td>${item.orderId}</td>
            <td>${item.productId}</td>
            <td>${item.thisFlow}</td>
            <td>${item.nextFlow!''}</td>
            <td>${item.worker}</td>
            <td>${item.nextWorker}</td>
            <td>
                <!-- 假设status是一个枚举或者对应一个描述，这里简单用数字表示 -->
                <#if item.status == -1>
                    待开始
                <#elseif item.status == 0>
                    待完成
                <#elseif item.status == 1>
                    待押平
                <#elseif item.status == 2>
                    待发出
                </#if>
            </td>
            <!-- 可以根据需要添加更多列的内容 -->
        </tr>
    </#list>
</table>


</body>
</html>